<template>
  <div class="page-real-content">
   <el-button  @click="viewDialog('current')" type="primary" style="">查看</el-button>
   <!-- 主页 -->
    <el-tabs v-model="activeName" @tab-click="handleDialogClick">
      <el-tab-pane   label="文件基本信息" name="1" :style="pageStyle">
        <div v-loading="file.loading">
          <h3 class="dialog-plate-title"><span>基本信息</span></h3>
          <el-form :inline="true" ref="filebaseRef" :rules="file.rules" label-position="right" label-width="150px" :model="file.baseInfo">
            <el-form-item label="文件名称" prop="fileName">
                <el-input v-model="file.baseInfo.fileName" class="width220" :disabled="file.baseInfo.updateTimes===0||file.baseInfo.updateTimes>0"></el-input>
            </el-form-item>
            <el-form-item label="文件编码"  prop="fileCode">
                <el-input v-model="file.baseInfo.fileCode" class="width220" :disabled="file.baseInfo.updateTimes===0||file.baseInfo.updateTimes>0"></el-input>
            </el-form-item>
            <el-form-item label="版本号"  prop="versionCode">
                <el-input v-model="file.baseInfo.versionCode" class="width220" :disabled="file.baseInfo.updateTimes===0||file.baseInfo.updateTimes>0"></el-input>
            </el-form-item>
            <el-form-item label="修订次数">
                <el-input v-model="file.baseInfo.updateTimes" disabled class="width220"></el-input>
            </el-form-item>
            <el-form-item label="文件创建人">
              <el-input v-model="file.baseInfo.fileWriterName " disabled class="width220"></el-input>
            </el-form-item>
            <el-form-item label="创建日期">
              <el-input v-model="file.baseInfo.createTime" disabled class="width220"></el-input>
            </el-form-item>
            <el-form-item label="最后修改日期">
              <el-input v-model="file.baseInfo.lastUpdateTime" disabled class="width220"></el-input>
            </el-form-item>
            <el-form-item label="所属文件夹">
              <el-input v-model="file.baseInfo.fileGs" disabled class="width220"></el-input>
            </el-form-item>
            <el-form-item label="文件发布人">
              <el-input v-model="file.baseInfo.fileApproverName" disabled class="width220"></el-input>
            </el-form-item>
            <el-form-item label="文件是否发布">
              <el-select v-model="file.baseInfo.isApproval" class="width220">
                <el-option label="否" value="0"></el-option>
                <el-option label="是" value="1"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="相关部门"  prop="fileUseScope">
              <el-select v-model="file.baseInfo.fileUseScope" multiple placeholder="请选择" class="width220">
                <el-option v-for="item in departments" :key="item.id" :label="item.deptName" :value="item.id">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item class="form-item-block text-right" >
              <el-button  @click="submitUpDateFileBase" type="primary">{{file.baseInfo.updateTimes!==null?'发布':'编辑'}}</el-button>
            </el-form-item>
          </el-form>
        </div>
        <div v-if="file.baseInfo.updateTimes!==null">
          <h3 class="dialog-plate-title"><span>记录</span></h3>
          <el-tabs  v-model="file.activeName" @tab-click="handleRecordClick">
            <el-tab-pane label="申请修改记录" name="1">
              <!-- 新增按钮 -->
              <el-button v-if="jurisdiction.addEditApplyInfo"  @click="showDialog('insert')" type="primary" icon="el-icon-plus" size="mini">新增申请修改</el-button>
              <!-- 记录列表 -->
              <el-table :data="file.updateRecordList" stripe border class="user-table" style="width: 100%;">
                <el-table-column fixed type="index" label="*" sortable width="40"></el-table-column>
                <el-table-column prop="fileCode" label="文件编码" sortable width="140"></el-table-column>
                <el-table-column prop="versionCode" label="版本号" sortable width="120"></el-table-column>
                <el-table-column prop="applicantName" label="申请人" sortable width="110"></el-table-column>
                <el-table-column prop="isTrain" label="是否需要培训" sortable width="80" align="center">
                  <template slot-scope="scope">
                    <span :class="['table-judge',scope.row.isTrain==='1'?'el-icon-circle-check cl-success':'']"></span>
                  </template>
                </el-table-column>
                <el-table-column prop="applyTime" label="申请时间"  sortable width="170"></el-table-column>
                <el-table-column prop="updateReason" label="申请原因" sortable min-width="400"></el-table-column>
                <el-table-column prop="approvalResult" label="申请结果"  sortable width="110" align="center">
                  <template slot-scope="scope">
                    <el-tag type="success" v-if="scope.row.approvalResult==='1'">通过</el-tag>
                    <el-tag type="danger" v-else-if="scope.row.approvalResult==='0'">未通过</el-tag>
                    <el-tag type="info" v-else>审核中</el-tag>
                  </template>
                </el-table-column>
                <el-table-column fixed="right" label="操作" sortable align="right" width="170">
                  <template slot-scope="scope">
                    <el-button v-if="jurisdiction.addEditApplyInfo"  @click="showDialog('update',scope.row)" type="text" size="small">编辑</el-button>
                    <el-button v-if="jurisdiction.auditingApply" type="text" size="small" @click="showDialog('checked',scope.row)">审核</el-button>
                    <el-button type="text" size="small" @click="showDialog('historyList',scope.row)">历史记录</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </el-tab-pane>
            <el-tab-pane label="回收与发放记录" name="2">
              <el-button v-if="jurisdiction.addPrintGrantInfo" @click="showDialog1('insert')" type="primary" icon="el-icon-plus" size="mini">新增发放</el-button>
              <el-table :data="file.recyclingDistributionList" stripe border class="user-table"  style="width: 100%;">
                <el-table-column fixed type="index" label="*" sortable width="40"></el-table-column>
                <el-table-column prop="versionCode" label="版本号" sortable width="150"></el-table-column>
                <el-table-column prop="issuerName" label="发放人" sortable width="100"></el-table-column>
                <el-table-column prop="num" label="发放数量" sortable width="70"></el-table-column>
                <el-table-column prop="accepterName" label="接收人" sortable width="100"></el-table-column>
                <el-table-column prop="acceptTime" label="接收时间" sortable width="150"></el-table-column>
                <el-table-column prop="recyclingPersonName" label="回收人" sortable width="100"></el-table-column>
                <el-table-column prop="recyclingTime" label="回收时间" sortable width="150"></el-table-column>
                <el-table-column prop="recyclingVersionCode" label="回收号" sortable width="150"></el-table-column>
                <el-table-column prop="remark" label="备注" sortable min-width="160"></el-table-column>
                <el-table-column fixed="right" label="操作" sortable align="center" width="80">
                  <template slot-scope="scope">
                    <el-button @click="showDialog1('update',scope.row)" type="text" size="small">回收</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </el-tab-pane>
            <el-tab-pane label="培训记录" name="3">
              <el-table :data="file.trainingRecordList" stripe border class="user-table" style="width: 100%;">
                <el-table-column fixed type="index" label="*" sortable width="40"></el-table-column>
                <el-table-column prop="versionCode" label="版本号" sortable width="150"></el-table-column>
                <el-table-column prop="trainerName" label="培训主持人" sortable width="120"></el-table-column>
                <el-table-column prop="trainTime" label="培训时间" sortable width="150"></el-table-column>
                <el-table-column prop="studyPersons" label="培训参与人" sortable min-width="180"></el-table-column>
                <el-table-column fixed="right" label="操作" sortable align="center" width="80">
                  <template slot-scope="scope">
                    <el-button @click="showDialog2('update',scope.row)" type="text" size="small">修改</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </el-tab-pane>
            <el-tab-pane label="版本记录" name="4">
              <el-table :data="file.versionRecordList" stripe border class="user-table" style="width: 100%;">
                <el-table-column fixed type="index" label="*" sortable width="40"></el-table-column>
                <el-table-column prop="versionCode" label="版本号" sortable width="180"></el-table-column>
                <el-table-column prop="fileCode" label="文件编码" sortable width="180"></el-table-column>
                <el-table-column prop="issuer" label="发布人" sortable width="130"></el-table-column>
                <el-table-column prop="issueTime" label="发布时间" sortable width="170"></el-table-column>
                <el-table-column prop="versionDesc" label="版本描述" sortable width="800"></el-table-column>
                <el-table-column fixed="right" label="操作" align="right" width="120">
                  <template slot-scope="scope">
                    <el-button @click="showdialog3('update',scope.row)" type="text" size="small">编辑</el-button>
                    <el-button @click="viewDialog('history',scope.row)" type="text" size="small">查看</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </el-tab-pane>
          </el-tabs>
        </div>
      </el-tab-pane>
      <el-tab-pane  label="目的" name="2" :style="pageStyle">
        <div v-if="jurisdiction.addBaseInfo&&file.content.name2.isLocked!==1">
          <quill-editor v-model="file.content.name2.fileContent"></quill-editor>
          <div class="text-right">
            <el-button  @click="submitUpdateFileContent(2)" type="primary">提交</el-button>
          </div>
        </div>
        <div v-html="file.content.name2.fileContent" v-else class="htmlContent"></div>
      </el-tab-pane>
      <el-tab-pane  label="适用范围" name="3" :style="pageStyle">
        <div v-if="jurisdiction.addBaseInfo&&file.content.name3.isLocked!==1">
          <quill-editor v-model="file.content.name3.fileContent"></quill-editor>
          <div class="text-right">
            <el-button  @click="submitUpdateFileContent(3)" type="primary">提交</el-button>
          </div>
        </div>
        <div v-html="file.content.name3.fileContent" v-else class="htmlContent"></div>
      </el-tab-pane>
      <el-tab-pane  label="职责" name="4" :style="pageStyle">
        <div v-if="jurisdiction.addBaseInfo&&file.content.name4.isLocked!==1">
          <quill-editor v-model="file.content.name4.fileContent"></quill-editor>
          <div class="text-right">
            <el-button  @click="submitUpdateFileContent(4)" type="primary">提交</el-button>
          </div>
        </div>
        <div v-html="file.content.name4.fileContent" v-else class="htmlContent"></div>
      </el-tab-pane>
      <el-tab-pane  label="定义/缩写语" name="5" :style="pageStyle">
        <div v-if="jurisdiction.addBaseInfo&&file.content.name5.isLocked!==1">
          <quill-editor v-model="file.content.name5.fileContent"></quill-editor>
          <div class="text-right">
            <el-button  @click="submitUpdateFileContent(5)" type="primary">提交</el-button>
          </div>
        </div>
        <div v-html="file.content.name5.fileContent" v-else class="htmlContent"></div>
      </el-tab-pane>
      <el-tab-pane  label="流程图" name="6" :style="pageStyle">
        <div  v-if="jurisdiction.addBaseInfo&&file.content.name6.isLocked!==1">
          <quill-editor v-model="file.content.name6.fileContent"></quill-editor>
          <div class="text-right">
            <el-button  @click="submitUpdateFileContent(6)" type="primary">提交</el-button>
          </div>
        </div>
        <div v-html="file.content.name6.fileContent" v-else class="htmlContent"></div>
      </el-tab-pane>
      <el-tab-pane  label="程序" name="7" :style="pageStyle">
        <div v-if="jurisdiction.addBaseInfo&&file.content.name7.isLocked!==1">
          <quill-editor v-model="file.content.name7.fileContent"></quill-editor>
          <div class="text-right">
            <el-button  @click="submitUpdateFileContent(7)" type="primary">提交</el-button>
          </div>
        </div>
        <div v-html="file.content.name7.fileContent" v-else class="htmlContent"></div>
      </el-tab-pane>
      <el-tab-pane  label="相关文件" name="8" :style="pageStyle">
        <div v-if="jurisdiction.addBaseInfo&&file.content.name8.isLocked!==1">
          <quill-editor v-model="file.content.name8.fileContent"></quill-editor>
          <div class="text-right">
            <el-button  @click="submitUpdateFileContent(8)" type="primary">提交</el-button>
          </div>
        </div>
        <div v-html="file.content.name8.fileContent" v-else class="htmlContent"></div>
      </el-tab-pane>
      <el-tab-pane  label="相关记录" name="9" :style="pageStyle">
        <div  v-if="jurisdiction.addBaseInfo&&file.content.name9.isLocked!==1">
          <quill-editor v-model="file.content.name9.fileContent"></quill-editor>
          <div class="text-right">
            <el-button  @click="submitUpdateFileContent(9)" type="primary">提交</el-button>
          </div>
        </div>
        <div v-html="file.content.name9.fileContent" v-else class="htmlContent"></div>
      </el-tab-pane>
      <el-tab-pane  label="附件" name="10" :style="pageStyle">
        <div v-loading="file.enclosure.loading">
          <el-form label-position="right" label-width="110px" :model="file.enclosure.formData">
            <el-form-item label="选择附件">
              <el-upload class="upload-demo"
                ref="uploadEnclosure"
                action="string"
                :auto-upload="false" 
                :limit="1" 
                :http-request="uploadSectionFile">
                <el-button slot="trigger" size="small" type="primary">上传附件</el-button>
              </el-upload>
            </el-form-item >
            <el-form-item label="文件描述">
              <el-input v-model="file.enclosure.formData.fileDesc" type="textarea"></el-input>
            </el-form-item>
            <el-form-item>
              <el-button @click="submitEnclosure" type="primary">提交</el-button>
            </el-form-item>
          </el-form>
        </div>
        <!-- 附件列表 -->
        <h3 class="dialog-plate-title"><span>已上传附件列表</span></h3>
        <el-table :data="file.enclosure.listData" stripe border class="user-table">
          <el-table-column fixed type="index" label="*" sortable width="40"></el-table-column>
          <el-table-column prop="fileName" label="文件名称" sortable min-width="140"></el-table-column>
          <el-table-column prop="fileDesc" label="文件描述" sortable min-width="170"></el-table-column>
          <el-table-column prop="uploadPersonName" label="上传人" sortable width="130"></el-table-column>
          <el-table-column prop="uploadTime" label="上传时间" sortable width="150"></el-table-column>
          <el-table-column fixed="right" label="操作" sortable align="center" width="80">
            <template slot-scope="scope">
              <el-button @click="downloadAppendix(scope.row)" type="text" size="small">下载</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
    </el-tabs>
    <!-- 新增 修改 申请修改记录弹框 -->
    <!-- 申请修改单记录弹框 -->
    <el-dialog :title="file.dialog.title" width="1000px" class="bodyNopaddingTop" :visible.sync="file.dialog.isShow" :close-on-click-modal="false" v-dialogDrag>
      <div v-if="file.dialog.type==='insert'||file.dialog.type==='update'">
        <el-form label-position="right" label-width="110px" :model="file.dialog.formData" ref="applyRecordRef" :rules="file.dialog.rules">
          <el-form-item label="文件编码"  prop="fileCode">
            <el-input v-model="file.dialog.formData.fileCode" :disabled="file.dialog.formData.approvalResult !== '-1'&&file.dialog.type==='update'"></el-input>
          </el-form-item>
          <el-form-item label="版本号" prop="versionCode">
            <el-input v-model="file.dialog.formData.versionCode" :disabled="file.dialog.formData.approvalResult !== '-1'&&file.dialog.type==='update'"></el-input>
          </el-form-item>
          <el-form-item label="是否需要培训">
            <el-select v-model="file.dialog.formData.isTrain" :disabled="file.dialog.formData.approvalResult !== '-1'&&file.dialog.type==='update'">
              <el-option label="否" value="0"></el-option>
              <el-option label="是" value="1"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="申请原因">
            <el-input v-model="file.dialog.formData.updateReason" :disabled="file.dialog.formData.approvalResult !== '-1'&&file.dialog.type==='update'" type="textarea"></el-input>
          </el-form-item>
          <el-form-item label="申请人" v-if="file.dialog.type==='update'">
            <el-input v-model="file.dialog.formData.applicantName" disabled></el-input>
          </el-form-item>
          <el-form-item label="申请时间"  v-if="file.dialog.type==='update'">
            <el-input v-model="file.dialog.formData.applyTime" disabled></el-input>
          </el-form-item>
          <el-form-item>
          <el-button v-if="file.dialog.formData.approvalResult !== '1'" @click="submitUpdateRecord()" type="primary">确 定</el-button>
          </el-form-item>
        </el-form>
      </div>
      <div v-else-if="file.dialog.type==='checked'">
        <div>
          <h3 class="dialog-plate-title"><span>审核部门列表</span></h3>
          <el-table :data="file.dialog.checkTableList" stripe border height="300px" class="user-table" style="width: 100%;">
            <el-table-column fixed type="index" label="*" sortable width="40"></el-table-column>
            <el-table-column prop="deptName" label="审核部门" sortable width="120"></el-table-column>
            <el-table-column prop="approvalerName" label="审核人" sortable width="110"></el-table-column>
            <el-table-column prop="approvalTime" label="审核时间"  sortable width="150"></el-table-column>
            <el-table-column prop="isApproval" label="审核结果" sortable width="110" align="center">
              <template slot-scope="scope">
                  <el-tag type="success" v-if="scope.row.isApproval==='1'">通过</el-tag>
                  <el-tag type="danger" v-else-if="scope.row.isApproval==='0'">未通过</el-tag>
                  <el-tag type="info" v-else>审核中</el-tag>
              </template>
            </el-table-column>
            <el-table-column prop="approvalAdvice" label="审核意见" sortable min-width="120"></el-table-column>
            <el-table-column fixed="right" label="操作" sortable align="center" width="80">
              <template slot-scope="scope">
                <el-button type="text" size="small" @click="showChecked(scope.row)" v-if="!scope.row.isApproval">审核</el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <div v-if="file.dialog.checkFormData.deptName">
          <h3 class="dialog-plate-title" style="margin: 10px 0;"><span>审核操作</span></h3>
          <el-form :inline="true" class="demo-form-inline" label-position="right" label-width="110px" :model="file.dialog.checkFormData">
            <el-form-item label="审核人">
              <el-input v-model="file.dialog.checkFormData.approvalerName" disabled class="width220"></el-input>
            </el-form-item>
            <el-form-item label="审核时间">
              <el-input v-model="file.dialog.checkFormData.approvalTime" disabled class="width220"></el-input>
            </el-form-item>
            <el-form-item label="审核部门">
              <el-input v-model="file.dialog.checkFormData.deptName" disabled  class="width220"></el-input>
            </el-form-item>
            <el-form-item label="审核结果">
              <el-select v-model="file.dialog.checkFormData.isApproval" class="width220" >
                  <el-option label="不通过" value="0"></el-option>
                  <el-option label="通过" value="1"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="审核意见" class="form-item-block">
              <el-input v-model="file.dialog.checkFormData.approvalAdvice"   type="textarea" style="width: 523px;"></el-input>
            </el-form-item>
          </el-form>
          <div class="text-center">
            <el-button @click="submitExamine" type="primary">提交审核</el-button>
          </div>
        </div>
      </div>
      <div v-else-if="file.dialog.type==='historyList'">
        <el-table :data="file.dialog.historyList" stripe border height="700px" class="user-table" style="width: 100%;">
          <el-table-column fixed type="index" label="*" sortable width="40"></el-table-column>
          <el-table-column prop="contentType" label="修改类型" :formatter="formatContentType" sortable width="110" align="center"></el-table-column>
          <el-table-column prop="beforeContent" label="修改前" sortable min-width="120">
            <template slot-scope="scope">
              <div v-html="scope.row.beforeContent"></div>
            </template>
          </el-table-column>
          <el-table-column prop="afterContent" label="修改后" sortable min-width="120">
            <template slot-scope="scope">
              <div v-html="scope.row.afterContent"></div>
            </template>
          </el-table-column>
          <el-table-column prop="fileUpdateWriterName" label="修改人"  sortable width="100"></el-table-column>
          <el-table-column prop="updateTime" label="修改时间" sortable width="150"></el-table-column>
        </el-table>
      </div>
    </el-dialog>
    <!-- 发放与回收 弹框 -->
    <el-dialog :title="file.dialog1.title" width="800px" class="bodyNopaddingTop" :visible.sync="file.dialog1.isShow" :close-on-click-modal="false" v-dialogDrag>
      <el-form :inline="true"  label-position="right" label-width="110px" :model="file.dialog1.formData">
        <el-form-item label="发放人">
          <el-input v-model="file.dialog1.formData.issuerName" disabled class="width220"></el-input>
        </el-form-item>
        <el-form-item label="接收时间">
          <el-input v-model="file.dialog1.formData.acceptTime" disabled class="width220"></el-input>
        </el-form-item>
        <el-form-item label="发放版本">
          <el-input v-model="file.dialog1.formData.issueCode" disabled class="width220"></el-input>
        </el-form-item>
        <el-form-item label="发放数量">
          <el-input type="number" v-model="file.dialog1.formData.num" :disabled="file.dialog1.type !== 'insert'" class="width220"></el-input>
        </el-form-item>
        <el-form-item label="接收人">
          <el-select v-model="file.dialog1.formData.accepter" :disabled="file.dialog1.type !== 'insert'" class="width220">
            <el-option v-for="item in file.dialog1.receiverList" :key="item.id" :label="item.name" :value="item.id"></el-option>
          </el-select>
        </el-form-item>
        <div v-if="file.dialog1.type !== 'insert'">
          <el-form-item label="回收人">
            <el-input v-model="file.dialog1.formData.recyclingPersonName" disabled class="width220"></el-input>
          </el-form-item>
          <el-form-item label="回收时间">
            <el-input v-model="file.dialog1.formData.recyclingTime" disabled class="width220"></el-input>
          </el-form-item>
          <el-form-item label="回收版本">
            <el-input v-model="file.dialog1.formData.recyclingVersionCode" class="width220"></el-input>
          </el-form-item>
        </div>
        <el-form-item label="备注" class="form-item-block">
          <el-input v-model="file.dialog1.formData.remark" type="textarea" class="width520"></el-input> 
        </el-form-item>
        <el-form-item class="form-item-block text-center">
          <el-button type="primary" @click="submitRecyclingDistribution">确 定</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
     <!-- 培训记录 弹框 -->
    <el-dialog :title="file.dialog2.title" width="800px" class="bodyNopaddingTop" :visible.sync="file.dialog2.isShow" :close-on-click-modal="false" v-dialogDrag>
      <el-form label-position="right" label-width="110px" :model="file.dialog2.formData">
        <el-form-item label="版本号">
          <el-input v-model="file.dialog2.formData.versionCode" disabled></el-input>
        </el-form-item>
        <el-form-item label="培训主持人">
          <el-input v-model="file.dialog2.formData.trainerName" disabled></el-input>
        </el-form-item>
        <el-form-item label="培训时间">
          <el-date-picker v-model="file.dialog2.formData.trainTime" format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss" type="datetime" placeholder="选择日期时间"></el-date-picker>
        </el-form-item>
        <el-form-item label="培训参与人员" class="form-item-block ">
          <el-input v-model="file.dialog2.formData.studyPersons" type="textarea" class="width520"></el-input>
        </el-form-item>
        <el-form-item class="form-item-block text-center" v-if="jurisdiction.addEditApplyInfo">
          <el-button @click="submitTrainRecord" type="primary">确 定</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
    <!-- 版本记录 -->
    <el-dialog :title="file.dialog3.title" width="800px" class="bodyNopaddingTop" :visible.sync="file.dialog3.isShow" :close-on-click-modal="false" v-dialogDrag>
      <el-form label-position="right" label-width="110px" :model="file.dialog3.formData">
        <el-form-item label="版本号">
          <el-input v-model="file.dialog3.formData.versionCode" disabled></el-input>
        </el-form-item>
        <el-form-item label="文件编码">
          <el-input v-model="file.dialog3.formData.fileCode" disabled></el-input>
        </el-form-item>
        <el-form-item label="发布人">
          <el-input v-model="file.dialog3.formData.issuer" disabled></el-input>
        </el-form-item>
        <el-form-item label="发布时间">
          <el-input v-model="file.dialog3.formData.issueTime" disabled></el-input>
        </el-form-item>
        <el-form-item label="版本描述">
          <el-input v-model="file.dialog3.formData.versionDesc" type="textarea"></el-input>
        </el-form-item>
        <el-form-item class="form-item-block text-center" v-if="jurisdiction.addEditApplyInfo">
          <el-button @click="submitVersionRecord" type="primary">确 定</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>

    <!-- 打印弹框 -->
    <el-dialog title="打印" class="bodyNopaddingTop" width="1000px" top="30px" :visible.sync="file.printDialog.isShow" :close-on-click-modal="false" v-dialogDrag>
            <el-button v-if="jurisdiction.addPrintGrantInfo" type="primary" @click="PrintData">打印文件</el-button>
            <div id="printData" v-if="file.printDialog.isShow">
                <h2 style="text-align: center;">{{file.printDialog.printObj.qsFile.fileName}}</h2>
                <ul class="printData_subTitle" style="overflow: hidden;margin: 10px 0 5px;">
                    <li style="list-style:none;float: left;font-size:12px;width: 10%;height: 20px;padding: 0 5px !important;text-align:right;">
                        文件编码：
                    </li>
                    <li style="list-style:none;float: left;font-size:12px;width: 20.6%;height: 20px;padding: 0 5px !important;">
                        {{file.printDialog.printObj.qsFile.fileCode}}
                    </li>
                    <li style="list-style:none;float: left;font-size:12px;width: 10%;height: 20px;padding: 0 5px !important;text-align:right;">
                        {{ file.printDialog.printObj.qsFile.fileId === "版本记录" ? "发布时间：" : "创建日期："}}
                    </li>
                    <li style="list-style:none;float: left;font-size:12px;width: 20.6%;height: 20px;padding: 0 5px !important;">
                        {{file.printDialog.printObj.qsFile.createTime}}
                    </li>
                    <li style="list-style:none;float: left;font-size:12px;width: 10%;height: 20px;padding: 0 5px !important;text-align:right;">
                        版本号：
                    </li>
                    <li style="list-style:none;float: left;font-size:12px;width: 20.6%;height: 20px;padding: 0 5px !important;">
                        {{file.printDialog.printObj.qsFile.versionCode}}
                    </li>
                </ul>
                <div v-if="file.printDialog.printObj.qsFileContents.length>0">
                  <p style="font-size: 17px;margin: 0;">1、目的</p>
                  <div  v-html="file.printDialog.printObj.qsFileContents[0].fileContent"  class="htmlContent"></div>
                  <p style="font-size: 17px;margin: 0;">2、适用范围</p>
                  <div  v-html="file.printDialog.printObj.qsFileContents[1].fileContent"  class="htmlContent"></div>
                  <p style="font-size: 17px;margin: 0;">3、职责</p>
                  <div v-html="file.printDialog.printObj.qsFileContents[2].fileContent"  class="htmlContent"></div>
                  <p style="font-size: 17px;margin: 0;">4、定义/缩写语</p>
                  <div v-html="file.printDialog.printObj.qsFileContents[3].fileContent"  class="htmlContent"></div>
                  <p style="font-size: 17px;margin: 0;">5、流程图</p>
                  <div v-html="file.printDialog.printObj.qsFileContents[4].fileContent"  class="htmlContent"></div>
                  <p style="font-size: 17px;margin: 0;">6、程序</p>
                  <div   v-html="file.printDialog.printObj.qsFileContents[5].fileContent"  class="htmlContent"></div>
                  <p style="font-size: 17px;margin: 0;">7、相关文件</p>
                  <div   v-html="file.printDialog.printObj.qsFileContents[6].fileContent"  class="htmlContent"></div>
                  <p style="font-size: 17px;margin: 0;">8、相关记录</p>
                  <div v-html="file.printDialog.printObj.qsFileContents[7].fileContent"  class="htmlContent"></div>
                </div>
            </div>
        </el-dialog>
  </div>
</template>
<script>
import baseApi from 'plugins/axios/baseApi.js'
import qualitySystemApi from 'plugins/axios/qualitySystemApi.js'
import pdf from 'vue-pdf'
import 'quill/dist/quill.core.css';
import 'quill/dist/quill.snow.css';
import 'quill/dist/quill.bubble.css';
import {quillEditor} from 'vue-quill-editor';
import {mapState} from 'vuex'
export default {
  components:{
    quillEditor
  },
  data(){
    return {
      orgId:'',/**法规文件orgId*/
      activeName: '1',
      jurisdiction:{
        addBaseInfo: false,
        addEditApplyInfo: false,
        addPrintGrantInfo: false,
        auditingApply: false,
        fileRelease: false,
        selectList: false
      },
      departments:[],/**相关部门列表 */
      file:{
        rules:{
          fileCode:[{required: true, message: '请输入文件编码', trigger: 'blur' }],
          versionCode:[{required: true, message: '请输入版本号', trigger: 'blur' }],
          fileUseScope:[{required: true, message: '请选择至少一个相关部门', trigger: 'blur'}]
        },
        loading:false,
        baseInfo:{},
        activeName:'1',
        content:{
          name2:{},
          name3:{},
          name4:{},
          name5:{},
          name6:{},
          name7:{},
          name8:{},
          name9:{}
        },
        enclosure:{
          loading:false,
          formData:{},
          listData:[]
        },/**附件 */
        updateRecordList:[], /**申请修改记录列表 */
        dialog:{ /**申请修改记录弹框 */
          isShow:false,
          type:'',
          title:'',
          rules:{
            fileCode:[{required: true, message: '请输入文件编码', trigger: 'blur' }],
            versionCode:[{required: true, message: '请输入版本号', trigger: 'blur' }]
          },
          formData:{},
          checkTableList:[],/**审核列表 */
          checkFormData:{},/**审核表单 */
          historyList:[],/**历史记录列表 */
        },
        recyclingDistributionList:[],/**回收和发放记录列表 */
        dialog1:{ /**回收与发放记录弹框 */
          isShow:false,
          title:'',
          type:'',
          formData:{},
          receiverList:[]/**接收人列表 */
        },
        trainingRecordList:[],/**培训记录列表 */
        dialog2:{ /**培训记录记录弹框 */
          isShow:false,
          title:'',
          type:'',
          formData:{}
        },
        versionRecordList:[],/**版本记录列表 */
        dialog3:{ /**版本记录弹框 */
          isShow:false,
          title:'',
          type:'',
          formData:{}
        },
        printDialog:{/**打印弹框 */
          isShow:false,
          type:'',
          printObj:{}
        }
      }
    }
  },
  watch: {
    $route(){
     this.orgId = this.$route.query.orgId;
      this.activeName = "1";
      this.departments=[],/**相关部门列表 */
      this.file.activeName='1';
      this.getDepartmentsList();
      this.getFileBaseInfo();
      this.getMenuJurisdiction();
      this.getUpdateRecordList();
    }
  },
  computed:{
    ...mapState({clientHeight:state=>state.common.clientHeight}),
    pageStyle(){
      return {
        'height':(this.clientHeight-238)+'px',
        'overflow-y': 'auto',
        'overflow-x': 'hidden'
      };
    }
  },
  created(){
   
  },
  mounted(){
    this.orgId = this.$route.query.orgId;
    this.getDepartmentsList();
    this.getFileBaseInfo();
    this.getMenuJurisdiction()
    this.getUpdateRecordList()
  },
  methods:{
    /**切换顶部tab菜单 */
    handleDialogClick(tab,event){
      switch(tab.name){
        case '1':
          break;
        case '2':
        case '3':
        case '4':
        case '5':
        case '6':
        case '7':
        case '8':
        case '9':
          this.getFileContent();
          break;
        case '10':
          this.getCxwjEnclosureList();
          break
      }
    },
    /**切换记录tab菜单 */
    handleRecordClick(tab,event){
      switch(tab.name){
        case '1':
          this.getUpdateRecordList();
          break;
        case '2':
          this.getRecyclingDistributionList();
          break;
        case '3':
          this.getTrainingRecordList();
          break;
        case '4':
          this.getVersionRecordList();
          break;
      }
    },
    /**获取质量手册基本信息 */
    getFileBaseInfo(){
      let self = this;
      self.file.loading = true;
      qualitySystemApi.getZltxFileBaseInfo(self.orgId).then(res=>{
        self.file.loading = false;
        self.file.baseInfo = res.content;
     },error=>{
       self.file.loading = false;
     })
    },
    /**获取相关部门列表 */
    getDepartmentsList(){
      let self = this;
      qualitySystemApi.getDepartmentsList().then(res=>{
        self.departments=res.content;
      })
    },
    /** */
    getFileContent(){
      let self = this;
      qualitySystemApi.getFileContent(self.orgId,self.activeName).then(res=>{
        self.file.content[`name${self.activeName}`] = res.content;
        console.log(self.file.content);
      })
    },
    /**获取当前菜单当前用户的菜单权限 */
    getMenuJurisdiction(){
      let self = this;
      baseApi.getMenuJurisdiction(167).then(res=>{
        res.content.forEach(item=>{
          self.jurisdiction[item.component] = item.menuShow
        })
      })
    },
    /**获取申请修改记录列表 */
    getUpdateRecordList(){
      let self = this;
      qualitySystemApi.updateRecordList(this.orgId).then(res=>{
        self.file.updateRecordList = res.content;
      })
    },
    /**获取回收与发放记录列表 */
    getRecyclingDistributionList(){
      let self = this;
      qualitySystemApi.getRecyclingDistributionList(self.orgId).then(res=>{
        self.file.recyclingDistributionList = res.content;
      })
    },
    /**获取培训记录列表 */
    getTrainingRecordList(){
      let self = this;
      qualitySystemApi.getTrainingRecordList(self.orgId).then(res=>{
        self.file.trainingRecordList = res.content;
      })
    },
    /**获取版本记录列表 */
    getVersionRecordList() {
      let self = this;
      qualitySystemApi.getVersionRecordList(self.orgId).then(res=>{
        self.file.versionRecordList = res.content;
      })
    },
    /**点击显示弹框 */
    showDialog(type,row){
      let self  = this;
      self.file.dialog.type = type;
      switch(type){
        case "insert":
          self.file.dialog.isShow = true;
          self.file.dialog.title = "新增申请修改记录";
          self.file.dialog.formData = {
            fileId:self.orgId
          }
          break;
        case "update":
          self.file.dialog.isShow = true;
          self.file.dialog.title = "编辑申请修改记录";
          self.file.dialog.formData = JSON.parse(JSON.stringify(row))
          break;
        case 'checked':
          self.file.dialog.isShow = true;
          self.file.dialog.title = "审核列表";
          self.file.dialog.formData = JSON.parse(JSON.stringify(row))
          self.getCheckedList()
          break;
        case 'historyList':
          self.file.dialog.isShow = true;
          self.file.dialog.title = "历史记录";
          self.file.dialog.formData = JSON.parse(JSON.stringify(row))
          self.getHistoryList();
          break;
      }
    },
    /**提交 申请修改记录 表单 */
    submitUpdateRecord(){
      let self = this;
      self.$refs.applyRecordRef.validate((valid) => {
        if (valid) {
          qualitySystemApi.insertUpdateUpdateRecord(self.file.dialog.type,self.file.dialog.formData).then(res=>{
            self.file.dialog.isShow = false;
            self.getUpdateRecordList();
            self.$message.success(`${self.file.dialog.title}成功`)
          })
        }
      }) 
    },
    /**修改文件基本信息 */
    submitUpDateFileBase(){
      let self = this;
      self.$refs.filebaseRef.validate((valid) => {
        if (valid) {
          let postData = JSON.parse(JSON.stringify(self.file.baseInfo));
          postData.updateTimes===null? postData.updateTimes=0:''
          qualitySystemApi.insertUpdateFileBase('update',postData).then(res=>{
              self.$message.success(`文件基本信息修改成功！`)
              self.getFileBaseInfo();
          })
        }
      });
    },
    /**修改文件内容信息 */
    submitUpdateFileContent(type){
      let self = this;
      let postData = JSON.parse(JSON.stringify(self.file.content[`name${self.activeName}`]));
      postData.fileId = postData.fileId?postData.fileId:self.orgId,
      postData.contentType = postData.contentType?postData.contentType:self.activeName;
      qualitySystemApi.updateFileContent(postData).then(res=>{
        self.getFileContent()
        self.$message.success('修改成功！')
      })
    },
    /**获取申请修改记录 审核列表  */
    getCheckedList(){
      let self = this;
      qualitySystemApi.checkedList(self.file.dialog.formData.id).then(res=>{
        self.file.dialog.checkTableList = res.content;
        self.file.dialog.checkFormData={}
      })
    },
    /**显示审核表单 */
    showChecked(row){
      let self = this;
      self.file.dialog.checkFormData = JSON.parse(JSON.stringify(row));
    },
    /**审核结果提交 */
    submitExamine(){
      let self = this;
      let postData=JSON.parse(JSON.stringify(self.file.dialog.checkFormData))
      qualitySystemApi.updateChecked(postData).then(res=>{
        self.$message.success(`提交成功`)
        self.getCheckedList();
        self.getUpdateRecordList();
        self.getFileBaseInfo();
        self.file.dialog.checkFormData={};
        
      })
    },
    /**获取历史记录列表 */
    getHistoryList(){
      let self = this;
      qualitySystemApi.getHistoryList( self.file.dialog.formData.id).then(res=>{
        self.file.dialog.historyList = res.content;
      })
    },
    formatContentType(row, column, cellValue, index) {
      let name =''
      switch(cellValue){
        case "2":
          name ='目的';
          break;
        case "3":
          name ='适用范围';
          break;
        case "4":
          name ='职责';
          break;
        case "5":
          name ='定义/缩写语';
          break;
        case "6":
          name ='流程图';
          break;
        case "7":
          name ='程序';
          break;
        case "8":
          name ='相关文件';
          break;
        case "9":
          name ='相关记录';
          break;
        case "10":
          name ='附件';
          break;
        default:
          name ='';
          break;
      }
      return name;
    },
    showDialog1(type,row){
      let self = this;
      self.file.dialog1.isShow=true;
      self.file.dialog1.type = type;
      self.getReceiverList();
      switch(type){
        case 'insert':
          self.file.dialog1.title = '发放'
          self.file.dialog1.formData={
            fileId:self.orgId
          };
          break;
        case 'update':
          self.file.dialog1.title = '回收';
          self.file.dialog1.formData=JSON.parse(JSON.stringify(row));
          self.file.dialog1.formData.accepter = self.file.dialog1.formData.accepter?Number(self.file.dialog1.formData.accepter):null;
          break;
      }
    },
    /**获取接收人列表 */
    getReceiverList(){
      let self = this;
      qualitySystemApi.getReceiverList().then(res=>{
        self.file.dialog1.receiverList = res.content;
      })
    },
    /**新增发放-insert 回收-update  提交发放回收记录表单 */
    submitRecyclingDistribution(){
      let self = this;
      let postData=JSON.parse(JSON.stringify(self.file.dialog1.formData));
      qualitySystemApi.insertUpdateRecyclingDistribution(self.file.dialog1.type,postData).then(res=>{
        self.$message.success(`${self.file.dialog1.title}成功`);
        self.file.dialog1.isShow = false;
        self.getRecyclingDistributionList();
      })
    },
    showDialog2(type,row){
      let self = this;
      self.file.dialog2.type = type;
      self.file.dialog2.isShow = true;
      self.file.dialog2.title = '编辑';
      self.file.dialog2.formData = JSON.parse(JSON.stringify(row));
    },
    /**修改培训记录表单 */
    submitTrainRecord(){
      let self = this;
      let postData = JSON.parse(JSON.stringify(self.file.dialog2.formData))
      qualitySystemApi.updateTrainRecord(postData).then(res=>{
        self.$message.success(`${self.file.dialog2.title}成功`);
        self.file.dialog2.isShow = false;
        self.getTrainingRecordList();
      })
    },
    showdialog3(type,row){
      let self = this;
      self.file.dialog3.type = type;
      self.file.dialog3.isShow = true;
      self.file.dialog3.title = '编辑';
      self.file.dialog3.formData = JSON.parse(JSON.stringify(row));
    },
    /**修改版本记录 */
    submitVersionRecord(){
      let self = this;
      let postData = JSON.parse(JSON.stringify(self.file.dialog3.formData))
      qualitySystemApi.updateVersionRecord(postData).then(res=>{
        self.$message.success(`${self.file.dialog3.title}成功`);
        self.file.dialog3.isShow = false;
        self.getVersionRecordList();
      })
    },
    viewDialog(type,row){
      let self = this;
      self.file.printDialog.type = type
      switch(type){
        case 'current':
          qualitySystemApi.getZltxViewContent(self.orgId).then(res=>{
            self.file.printDialog.isShow = true;
            self.file.printDialog.printObj = res.content;

          })
          break;
        case 'history':
          self.file.printDialog.isShow = true;
          self.file.printDialog.printObj ={
            qsFile: {
              fileId: '版本记录',
              fileName: self.file.baseInfo.fileName,
              fileCode: row.fileCode,
              createTime: row.issueTime,
              lastUpdateTime: '',
              versionCode: row.versionCode,
              updateTimes: '',
              approvalTime: '',
              fileApprover: "",
              fileWriter: '',
              fileGs: '',
              isApproval: ''
            },
            qsFileContents: row.qsFileContents
          };
          break;
      }
    },
    /**根据文件id获取附件上传列表 */
    getCxwjEnclosureList(){
      let self = this;
      qualitySystemApi.getCxwjEnclosureList(self.orgId).then(res=>{
        self.file.enclosure.listData = res.content;
      })
    },
    /**附件提交上传*/
    uploadSectionFile(param){
      let self =this;
      self.file.enclosure.loading = true;
      let fileObj = param.file;
      let form =new FormData();
      let postData={
        fileId:self.orgId,
        fileDesc:self.file.enclosure.formData.fileDesc
      };
      form.append('qsAttachment',JSON.stringify(postData));
      form.append('file',fileObj);
      qualitySystemApi.enclosureUpload(form).then(res=>{
        self.file.enclosure.loading  = false;
        self.$message.success(`附件新增成功`);
        self.file.enclosure.formData.fileDesc='';
        self.$refs.uploadEnclosure.clearFiles();
        self.getCxwjEnclosureList();
      },error=>{
        self.file.enclosure.loading  = false;
      })
    },
    /**点击附件提交*/ 
    submitEnclosure(){
      let self = this;
      if(self.$refs.uploadEnclosure.uploadFiles.length>0){
        self.$refs.uploadEnclosure.submit()
      }else{
         self.$message.error(`请选择需要上传的附件！`)
      }
    },
    /**下载附件 */
    downloadAppendix(row) {
      window.location.href = qualitySystemApi.downloadEnclosure(row.id);
    },
  }
}
</script>
<style lang="stylus" scoped>

</style>